<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>javascript 阶段</title>
    <style>
        div {
            width: 100px;
            height: 120px;
            background-color:red;
            font-size: 30px;
        }
    </style>
</head>
<body>
    <div></div>
    <script>
        var dom = document.querySelector("div");

        var obj = getComputedStyle(dom);// 返回一个关于dom元素的样式对象

        var propWidth = obj["width"]; 

        console.log(propWidth); // 100px

        var width = parseInt(propWidth);

        console.log(width);// 100




        var w = parseInt( getComputedStyle(dom)["width"]);
        var h = parseInt( getComputedStyle(dom)["height"]);
        var fontSize = parseInt( getComputedStyle(dom)["fontSize"]);
        console.log(w);// 100
        console.log(h);// 120
        console.log(fontSize);// 30



    </script>

    
</body>
</html>